export const getMark = () => {
    const setWatermark = (str: any, container: HTMLElement) => {
        const id = "1.23452384164.123412416";
        const existingWatermark = document.getElementById(id);
        if (existingWatermark !== null) {
            container.removeChild(existingWatermark);
        }

        // 创建一个新的canvas元素，用于绘制水印图像
        const can = document.createElement("canvas");
        // 设置canvas的宽度和高度
        can.width = 200;
        can.height = 200;
        // 获取canvas的2D渲染上下文
        const cans = can.getContext("2d")!;
        // 旋转canvas的角度（逆时针15度）
        cans.rotate((-15 * Math.PI) / 180);
        // 设置字体样式
        cans.font = "18px Vedana";
        // 设置填充颜色和透明度
        cans.fillStyle = "rgba(200, 200, 200, 0.80)";
        // 设置文本对齐方式
        cans.textAlign = "left";
        // 在canvas上绘制文本，参数分别是文本内容，x坐标和y坐标
        cans.fillText(str, can.width / 8, can.height / 2);

        const div = document.createElement("div");
        div.id = id;
        div.style.pointerEvents = "none";
        div.style.position = "absolute";
        div.style.zIndex = "10";
        div.style.width = `${container.clientWidth}px`;
        div.style.height = `${container.clientHeight}px`;
        div.style.background = `url(${can.toDataURL("image/png")}) left top repeat`;
        container.appendChild(div);

        return id;
    };

    // 定义一个watermark函数，用于在给定的容器中创建水印
    const watermark = (str: string, container: HTMLElement) => {
        // 调用setWatermark函数创建水印，并获取其ID
        let id = setWatermark(str, container);
        // 设置一个定时器，每隔500毫秒检查水印是否存在，如果不存在则重新创建
        setInterval(() => {
            if (document.getElementById(id) === null) {
                id = setWatermark(str, container);
            }
        }, 500);
        // 当窗口大小改变时，重新创建水印
        window.onresize = () => {
            setWatermark(str, container);
        };
    };

    return { watermark };
};